<template>
	<view class="Wrapper" :style="mainStore.themeColor">
		<navBar title="热线客服"> </navBar>
		<view class="flex-1 d-flex f-column j-sa a-center">
			<view class="content">
				<image :src="staticImg('tb.png')" mode="aspectFill" class="tbImg"></image>
				<view class="contact_txt"
					>您好，如有任何问题或需要帮助，请随时与我们联系。 我们会尽快回复您。</view
				>
				<view class="Nowbox">
					<view class="li libg">人工客服上班时间：</view>
					<view class="li">9:00 - 18:00</view>
				</view>
			</view>
			<view class="Ttn themeBg">拨打电话</view>
		</view>
	</view>
</template>

<script setup>
	import { ref } from 'vue';
	import { onLoad } from '@dcloudio/uni-app';
	import { useMainStore } from '@/stores/index';
	import { staticImg } from '@/utils/utils.js';
	const mainStore = useMainStore();
</script>

<style lang="scss" scoped>
	.Wrapper {
		width: 100%;
		height: 100vh;
		display: flex;
		flex-direction: column;
		align-items: center;
		.content {
			width: 620rpx;
			display: flex;
			flex-direction: column;
			align-items: center;
			.tbImg {
				width: 438rpx;
				height: 316rpx;
			}
			.contact_txt {
				color: #666;
				font-size: 26rpx;
				text-align: center;
				line-height: 46rpx;
				margin-top: 20rpx;
			}
			.Nowbox {
				width: 560rpx;
				margin: 40rpx auto 0;
				display: flex;
				border: 1px solid #a4d4f7;
				border-radius: 10rpx;
				overflow: hidden;
				.li {
					flex: 1;
					height: 60rpx;
					display: flex;
					justify-content: center;
					align-items: center;
					color: #666;
					font-size: 26rpx;
					font-weight: bold;
				}
				.libg {
					background-color: #dbf0ff;
				}
			}
		}
		.Ttn {
			width: 347rpx;
			height: 99rpx;
			border-radius: 20rpx;
			text-align: center;
			line-height: 99rpx;
			color: #fff;
			font-size: 30rpx;
		}
	}
</style>
